<template>
	<view class="content">
		<view class="logo-box">
				<image class="logo" :src="IMG_URL+logo" mode="widthFix"></image>
				<button class="u-reset-button btn-moren" :loading="loading" v-if="user" @click="login">微信授权登录</button>
				<button class="u-reset-button btn-moren" v-else :loading="loading" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">授权绑定手机号</button>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				logo:'',
				IMG_URL:this.$IMG_URL,
				loading:false,
				user:true,
				user_id:'',
				url:''
			}
		},
		onLoad() {
			this.getLogo()
			// console.log(this.$IMG_URL)

		},
		methods: {
			//  获取logo
			getLogo(){
				this.$u.post('/user/getlogin').then(res =>{
					// console.log(res)
					this.logo = res.data.logo
				})
			},
			// 点击登录
			login(){
				this.loading = true
				var that = this
				uni.getUserProfile({
				  desc: "获取你的昵称、头像、地区及性别",
				  success: res => {
				    // console.log(res)
				    let wxUserInfo = res.userInfo;
					that.logins(wxUserInfo)
				  },
				  fail: res => {
				  	 //拒绝授权
					   uni.showToast({
						icon:'none',
						title:'取消授权'
					   })
					   that.loading = false
				    return;
				  }
				})
				
			},
			// 登录小程序
			logins(data){
				let that = this
				this.$u.post('/user/Userauthorization',{
					user_nickname:data.nickName,
					sex:data.gender,
					avatar:data.avatarUrl,
					openid:uni.getStorageSync('openid')
				}).then(res=>{
					that.user_id  = res.data.user_id
					uni.showToast({
						icon:'success',
						title:'授权成功'
					})
					that.loading = false
					that.user = false
					// setTimeout(()=>{
					// 	uni.navigateTo({
					// 		url:'../login_phone/login_phone'
					// 	})
					// },500)
				})
			},
			// 登录小程序
			getPhoneNumber(res) {
				this.loading = true
				if (res.detail.errMsg !== "getPhoneNumber:ok") {
					uni.showToast({
						icon:"none",
						title:'取消授权'
					})
					this.loading = false
					return;
				}
				let that = this
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						that.$u.post('/user/getMobile',{
							code:loginRes.code,
							encryptedData:res.detail.encryptedData,
							iv:res.detail.iv
						}).then(res =>{
							//console.log(res)
							uni.showToast({
								icon:"success",
								title:'授权手机号成功'
							})
							that.loading = false
							uni.setStorageSync('userId',that.user_id)
							setTimeout(()=>{
								uni.reLaunch({
									url:'/pages/user/index/index',
									// success: function (e) {
									//     var page = getCurrentPages().pop();
									// 	 var a = getCurrentPages()
									// 	 console.log(a)
									//      if (page == undefined || page == null) return;
									//         page.onLoad();
									//       }
								})
							},500)
							that.postPhone(res.data.phoneNumber)
						}).catch(err =>{
							that.loading = false
							uni.showToast({
								icon:'none',
								title:'请求频繁，请重新进入小程序重试'
							})
							// uni.showToast({
							// 	icon:"none",
							// 	title:err.msg
							// })
						})
					},
				})
				// console.log(res)
			},
			// 提交手机号
			postPhone (phoneNumber) {
				this.$u.post('/user/UserMobile',{
					phoneNumber:phoneNumber,
					user_id:uni.getStorageSync('userId'),
				})
			},
		}
	}
</script>

<style lang="less">
	page{
		background: url(https://s1.ax1x.com/2022/11/18/znm92T.jpg) no-repeat;
		background-size: 100% 100%;
	}
	.btn-moren{
		height: 130rpx;
		font-size: 50rpx;
	}
	.logo{
		width: 496rpx;
		height: 231rpx;
		margin-bottom: 184rpx;
	}
	.logo-box{
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		margin-top: 30%;
	}
</style>
